<template>
  <div style="margin:30px;width:100%;height:100%">
    <el-button type="info" style="margin-left:84%" @click="back">返回</el-button>
    <el-button v-print="'#printTest'" type="success">打印</el-button>
    <div id="printTest">
      <h1 class="h">{{ name2 }}</h1>
      <p class="font">出货日报表</p>
      <!-- <span style="margin-left:25%">制表:{{ name }}</span>
      <span style="margin-left:400px">打印日期:{{ now }}</span><hr> -->
      <div class="case">
        <div>
          <p>制表:{{ name }}</p>
        </div>
        <div>
          <p>打印日期:{{ now }} </p>
        </div>
      </div>
      <table>
        <tr>
          <td style="width:800px">客户名称</td>
          <td style="width:400px">出货日期</td>
          <td style="width:400px">出货单号</td>
          <td style="width:800px">箱型</td>
          <td style="width:460px">出货数量</td>
          <td style="width:400px">单价</td>
          <td>金额</td>
          <td style="width:400px">回签状态</td>
        </tr>
        <tr v-for="item in tableData" :key="item.id">
          <td>{{ item.name }}</td>
          <td>{{ item.shipDate }}</td>
          <td>{{ item.outNo }}</td>
          <td>{{ item.boxType }}</td>
          <td>{{ item.sendNum }}</td>
          <td>{{ item.perPrice }}</td>
          <td>{{ item.money }}</td>
          <td>{{ item.sign }}</td>
        </tr>
      </table>
      <!-- <el-table
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
        border
        stripe
      >
        <el-table-column type="selection" width="55" />
        <el-table-column prop="name" label="客户名称" width="120" />
        <el-table-column prop="shipDate" label="出货日期" width="120" />
        <el-table-column prop="outNo" label="出货单号" width="120" />
        <el-table-column prop="boxType" label="箱型" width="120" />
        <el-table-column prop="sendNum" label="出货数量" width="120" />
        <el-table-column prop="perPrice" label="单价" width="120" />
        <el-table-column prop="money" label="金额" width="120" />
        <el-table-column prop="sign" label="回签状态" width="120" />
      </el-table> -->
      <!-- <p class="a">签收人:</p>
      <p class="b">签收时间:</p> -->
    <!-- <el-pagination
      :current-page="form.page"
      :page-sizes="[10, 20, 30, 40]"
      :page-size="form.size"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total"
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
    /> -->
    </div>
  </div>
</template>

<script>
// import { export2Excel } from '@/utils/common'
import { list } from '@/api/basedata/firm'
import { getUser } from '@/api/order/customerOrder'
export default {
  name: 'ProDaily',
  data() {
    return {
      tableData: [],
      total: 0,
      form: {
        page: 1,
        size: 10
      },
      name: '',
      name2: ''
    }
  },
  created() {
    list().then(res => {
      var firmList = []
      firmList = res.list
      firmList.forEach(a => {
        if (a.isFirm === true) {
          this.name2 = a.name
          console.log('name:' + this.name2)
        }
      })
    })
    getUser().then(res => {
      this.name = res.nickname
    })
    var date = new Date()
    this.now = date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate()
    var list2 = []
    var object = this.$route.query
    console.log(object)
    for (const key in object) {
      if (object.hasOwnProperty(key)) {
        const element = object[key]
        list2.push(element)
      }
    }
    this.tableData = list2
  },
  methods: {
    back() {
      this.$router.push('/shipdaily')
    }
  }
}
</script>

<style scoped>
.a{
  margin: 20px 0 0 55%;
  font-family: 'Courier New', Courier, monospace;
}
.b{
   margin: 20px 0 0 55%;
  font-family: 'Courier New', Courier, monospace;
}
.font{
  font-weight: bold;
  line-height: 100px;
  font-size: 30px;
  font-family: 'Courier New', Courier, monospace;
  width: 1050px;
  margin: 0 auto;
  text-align: center;
}
.h{
  width: 1050px;
  margin: 0 auto;
  text-align: center;
  font-weight: normal;
}
table,tr,td{
  border:1px solid black;
}
table{
  width:1050px;
  border-collapse:collapse;
  height: auto;
  margin: 0 auto;

}
tr{
  height: 35px;
}
table td{
  height: 35px;
}
td{
  width: 180px;
  text-align: center ;
  padding-left:15px;

}
.case{
  display: flex;
  justify-content: space-between;
  width: 1050px;
margin: 0 auto;
}
</style>
<style media="print">
  body {
    border: solid 1px #ffffff;
    margin:0;
  }
</style>
